import React, {PureComponent} from "react";

export class HelloWorld extends PureComponent {

    constructor(props) {
        super(props);
        this.state = {
            message: "Hello World Hook"
        }
    }

    render() {
        const {message} = this.state;
        return <div>
            <h2>HelloWorld:{message}</h2>
            <button>改变数据</button>
        </div>;
    }
}


function HelloWorldFunction() {
    const [message, setMessage] = React.useState("Hello World Hook");

    return <div><h2 onClick={e=>{setMessage("Hook")}}>HelloWorld:{message}</h2></div>;
}

export class App extends PureComponent {
    render() {
        return <div>
            <h2>App</h2>
            <HelloWorld/>
            <HelloWorldFunction/>
        </div>;
    }
}

export default App;
